iT邦幫忙

2024 iThome 鐵人賽

DAY 2
3
Modern Web

JavaScript學習筆記系列 第 2

[Day 02] 在Linux系統建置Node.js執行環境

  • 分享至 

  • xImage
  •  

在好想進入JS階段時,規定要在瀏覽器之外的執行環境寫JS,過去以為執行環境就只有瀏覽器,直到學習JS才知道Node.js也是執行環境之一。

這邊簡單介紹Node.js以及紀錄安裝的流程。

介紹

先來看看在官網上Node.js介紹:

Node.js® is a free, open-source, cross-platform JavaScript runtime environment that lets developers create servers, web apps, command line tools and scripts.

Node.js是開源、跨平台的JS執行環境,所以並不是程式語言!
當我們在電腦安裝了Node.js之後,就能開啟副檔名為.js的檔案。

安裝Node.js

直接搜尋Node.js官網,點選Download選單,linux安裝指令也一併提供在下方。

選擇安裝LTS(Long-term support,代表有長期維護)版本和選擇作業系統。
Download Node.js

  1. 開啟Terminal,按照官網教學輸入下方指令
# 安裝NVM

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.0/install.sh | bash

NVM(Node Version Manager)是Node.js的版本管理器

此時會遇到找不到curl的狀況,則須先安裝curl

sudo apt install curl

install curl

補充:要使用NVM,先載入 .bashrc 檔案啟動

source ~/.bashrc
  1. 下載和安裝Node.js(這裡選的是20版本)
nvm install 20
  1. 安裝完成確認版本,並檢查是否安裝成功
node -v 
npm -v 

在安裝Node.js時會一併安裝NPM,NPM(Node Package Manager)是套件管理工具。

check node_version

如何切換Node版本

我們可以nvm install安裝多個版本以上的Node.js,有時為了配合專案的需求而使用不同的版本。透過nvm use指令來切換:

nvm use node_version

nvm use

了解執行環境的重要性

為什麼要了解執行環境,是因為看到了Huli這篇文章才知道,有些功能是JS內建的,有些其實是runtime提供的,先簡單了解一下這兩者:

  • JavaScript 內建功能:是 ECMAScript 規範裡定義的,這些功能無論在瀏覽器還是 Node.js 中使用都會存在。
    一些常見的內建功能:例如:NumberStringBooleanArray.prototypeif/else等等。
  • runtime:最常見的 JavaScript runtime 是瀏覽器,瀏覽器提供 DOM等功能,讓 JavaScript 可以和網頁互動;Node.js則提供fs模組、網路請求等功能,它就沒有瀏覽器裡的 DOM功能 。而我們熟悉的consolesetTimeout等功能,兩個環境中都有,看起來一樣,背後實作卻是不一樣。

了解執行環境後,當把同一組程式碼搬到另一個環境有可能報錯,是因為該執行環境並沒有支援該功能。

若要簡單分辨功能是否為JS內建還是runtime可以查ECMAScript或MDN:

查詢if/else在MDN的規範,可以看到出處寫ECMAScript Language Specification,代表是ECMAScript原生提供的。
ECMAScript Language Specificationr

查詢console在MDN的規範出處寫Console Standard,並不是ECMAScript,代表是runtime提供的。
Console Standard

以上分享~希望能簡單幫助大家了解Node.js安裝和runtime是什麼:D

參考資料

How To Install Node.js on Ubuntu 20.04
從「為什麼不能用這個函式」談執行環境(runtime)


上一篇
[Day 01] JavaScript學習筆記 - 前言
下一篇
[Day 03] 變數、資料型別及判斷型別
系列文
JavaScript學習筆記13
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
jeremykuo
iT邦新手 5 級 ‧ 2024-09-16 11:10:11

原本完全不懂runtime呢!這篇有夠補

Chris iT邦新手 4 級 ‧ 2024-09-16 21:28:11 檢舉

有些翻譯成「宿主環境」
runtime 我自己會翻譯成「執行環境」

Chris iT邦新手 4 級 ‧ 2024-09-16 21:28:46 檢舉

runtime 我自己會翻譯成「執行環境」

我要留言

立即登入留言